<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>斑马线交规驾考系统后台管理</title>
    <link href="${pageContext.request.contextPath}/static/css/bootstrap.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/css/plugins/bootstrap-table/bootstrap-table.min.css"
          rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/css/font-awesome.min93e3.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/css/bootstrap-table-jumpto.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/css/style.min.css?v=4.1.0" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/css/admin.css">
</head>

<style>
    table {
        table-layout: fixed;
    }

    td {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
</style>
<body>

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-7">
                <div class="admin-so"><i class="fa fa-search"></i> 按层级筛选</div>
                <table class="table admin-so-text" id="ttt">
                    <tr>
                        <td width="80">类型：</td>
                        <td>
                            <a href="javascript:void(0);" onclick="typeq(3)" class="text-success font-bold">全部</a>
                            <a href="javascript:void(0);" onclick="typeq(0)" class="text-muted">单选题</a>
                            <a href="javascript:void(0);" onclick="typeq(2)" class="text-muted">多选题</a>
                            <a href="javascript:void(0);" onclick="typeq(1)" class="text-muted">判断题</a>
                        </td>
                    </tr>
                </table>
            </div>
            <div class="col-md-3">
                <div class="admin-so"><i class="fa fa-search"></i> 按关键字搜索</div>
                <form>
                    <div class="input-group">
                        <input type="text" class="form-control" name='keywords' value="" placeholder="请输入题目关键字或ID搜索">
                        <span id="keywords" class="input-group-btn">
                        <button class="btn btn-primary" type="button" onclick="Searchsubject()">搜索</button>
                    </span>
                    </div>
                </form>
            </div>
            <div class="col-md-1">
                <div class="admin-so"><i class="fa fa-user-plus"></i> 新增题目</div>
                <button class="btn btn-success" onclick='AddSubject()'>新增题目</button>
            </div>
            <div class="col-md-1">
                <div class="admin-so"><i class="fa fa-user-plus"></i> 删除题目</div>
                <button id="deltimu" class="btn btn-danger" onclick='Deltimu()'>删除题目</button>
            </div>
            <div>
                <table id="subjecttable" data-mobile-responsive="true">
                </table>
            </div>
        </div>
    </div>
</div>
<%--<div class="webfoot">斑马线交规驾考系统后台管理</div>--%>
<script src="${pageContext.request.contextPath}/static/js/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/static/layer/layer.js"></script>
<script src="${pageContext.request.contextPath}/static/js/plugins/bootstrap-table/bootstrap-table.js"></script>
<script src="${pageContext.request.contextPath}/static/js/plugins/bootstrap-table/bootstrap-table-mobile.js"></script>
<script src="${pageContext.request.contextPath}/static/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/demo/bootstrap-table-demo.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/CheckDaAn222.js"></script>
<script src="${pageContext.request.contextPath}/static/js/bootstrap-table-jumpto.js"></script>

<script type="text/javascript">
    var $subtable = $('#subjecttable');
    $subtable.bootstrapTable({
        url: '/subject',
        method: 'get',
        striped: true,
        cache: false,
        height: getHeight(),
        showJumpto: true,
        paginationLoop:false,
        pageNumber: 1,
        pageSize: 15,
        pageList: [10, 15],
        pagination: true,
        responseHandler: function (json) {
            json.data.rows = json.data.list;
            delete json.data.list;
            return json.data;
        },
        sidePagination: "server",
        queryParams: function (params) { // 请求服务器数据时发送的参数，可以在这里添加额外的查询参数，返回false则终止请求
            var temp = {
                pageSize: params.limit,
                pageNum: (params.offset / params.limit) + 1,
            };
            return temp;
        },
        clickToSelect: true,
        uniqueId: "id",
        columns: [
            {
                checkbox: true
            }, {
                field: 'id',
                title: '题目ID',
                width: '5%'
            }, {
                field: 'problem',
                title: '题目提纲',
                width: '40%'
            }, {
                title: '答案选项',
                width: '35%',
                formatter: function (value, row, index) {
                    var optiona = row.optiona;
                    var optionb = row.optionb;
                    var optionc = row.optionc;
                    var optiond = row.optiond;
                    var $div = $("<div>");
                    var kg = "...";
                    var aa = optiona.substr(0, 5);
                    var bb = optionb.substr(0, 5);
                    var cc = optionc.substr(0, 5);
                    var dd = optiond.substr(0, 5);
                    var finalA = aa + kg;
                    if (optiona.length < 6) {
                        finalA = optiona;
                    }
                    var finalB = bb + kg;
                    if (optionb.length < 6) {
                        finalB = optionb;
                    }
                    var finalC = cc + kg;
                    if (optionc.length < 6) {
                        finalC = optionc;
                    }
                    var finalD = dd + kg;
                    if (optiond.length < 6) {
                        finalD = optiond;
                    }
                    if (row.type === 0 || row.type === 2) {
                        $div.append("A、" + finalA + "&nbsp;&nbsp;B、" + finalB + "&nbsp;&nbsp;C、" + finalC + "&nbsp;&nbsp;D、" + finalD);
                    }
                    if (row.type === 1) {
                        $div.append("是" + "&nbsp;&nbsp;" + "否");
                    }
                    return $div.html();
                }
            }, {
                field: 'answer',
                title: '答案',
                width: '5%',
                formatter: function (value, row, index) {
                    var answer = row.answer;
                    var type = row.type;
                    //type:0单选  1判断  2多选   answer: 1对  2错
                    if (type == 0) {
                        if (answer == 1) {
                            return 'A';
                        }
                        if (answer == 2) {
                            return 'B';
                        }
                        if (answer == 4) {
                            return 'C';
                        }
                        if (answer == 8) {
                            return 'D';
                        }
                    } else if (type == 1) {
                        if (answer == 1) {
                            return '√';
                        }
                        if (answer == 2) {
                            return '×';
                        }
                    } else if (type == 2) {
                        if (answer == 3) {
                            return 'AB';
                        }
                        if (answer == 5) {
                            return 'AC';
                        }
                        if (answer == 6) {
                            return 'BC';
                        }
                        if (answer == 7) {
                            return 'ABC';
                        }
                        if (answer == 9) {
                            return 'AD';
                        }
                        if (answer == 10) {
                            return 'BD';
                        }
                        if (answer == 11) {
                            return 'ABD';
                        }
                        if (answer == 12) {
                            return 'CD';
                        }
                        if (answer == 13) {
                            return 'ACD';
                        }
                        if (answer == 14) {
                            return 'BCD';
                        }
                        if (answer == 15) {
                            return 'ABCD';
                        }
                    }
                }
            }, {
                title: "操作",
                clickToSelect: false,
                formatter: function (value, row, index) {
                    return '<a class="btn btn-xs btn-primary timuview" href="javascript:void(0);" onclick="ShwoDetail1(' + row.id + ')">查看</a>\n' +
                        '<a class="btn btn-xs btn-warning timuview" href="javascript:void(0);" onclick="ShwoDetail2(' + row.id + ')">查看(藏)</a>\n' +
                        '  <a class="btn btn-xs btn-success edituser" href="javascript:void(0);" onclick=\'EditSubject(' + row.id + ')\'>编辑</a>\n' +
                        '  <a class="btn btn-xs btn-danger" href="javascript:void(0);" onclick=\'DelSubject(' + row.id + ')\'>删除</a>';

                }
            }]
    });


    function getHeight() {
        return $(window).height() - 210;
    }

    $(window).resize(function () {
        $subtable.bootstrapTable('resetView', {
            height: getHeight()
        });
    });

    //增加题目
    function AddSubject() {
        layer.open({
            type: 2,
            title: '新增题目',
//            area: ['1300px', '90%'],
            area: ['100%', '100%'],
            fixed: false, //不固定
            maxmin: true,
            content: "/page/subject/subject_add.jsp",
            end:function () {
                $subtable.bootstrapTable('refresh');
            }
        });
    }

    //编辑题目
    function EditSubject(key) {
        var aa = $('#subjecttable').bootstrapTable('getRowByUniqueId', key);
        layer.open({
            type: 2,
            title: '编辑题目',
            area: ['100%', '100%'],
            fixed: false, //不固定
            maxmin: true,
            content: "/page/subject/subject_edit.jsp",
            success: function (layero, index) {
                var body = layer.getChildFrame('body', index);
                body.find("input[name='id']").val(aa.id);
                body.find("input[name='problem']").val(aa.problem);
                body.find("input[name='zproblem']").val(aa.zproblem);
                body.find("input[name='optiona']").val(aa.optiona);
                body.find("input[name='zoptiona']").val(aa.zoptiona);
                body.find("input[name='optionb']").val(aa.optionb);
                body.find("input[name='zoptionb']").val(aa.zoptionb);
                body.find("input[name='optionc']").val(aa.optionc);
                body.find("input[name='zoptionc']").val(aa.zoptionc);
                body.find("input[name='optiond']").val(aa.optiond);
                body.find("input[name='zoptiond']").val(aa.zoptiond);
//                body.find("input[name='mtype1']").val(aa.mtype);
//                body.find("input[name='HiddenMtypejiqiao']").val(aa.tmtype);
                var answer = GetAnswerTwo(aa.answer, aa.type);
                body.find("input[name='answer']").val(answer);
                var iframeWin = window[layero.find('iframe')[0]['name']];
                var htmltitle = iframeWin.escape2Html(aa.htmltitle);
                var zhtmltitle = iframeWin.escape2Html(aa.zhtmltitle);
                var htmla = iframeWin.escape2Html(aa.htmla);
                var zhtmla = iframeWin.escape2Html(aa.zhtmla);
                var htmlb = iframeWin.escape2Html(aa.htmlb);
                var zhtmlb = iframeWin.escape2Html(aa.zhtmlb);
                var htmlc = iframeWin.escape2Html(aa.htmlc);
                var zhtmlc = iframeWin.escape2Html(aa.zhtmlc);
                var htmld = iframeWin.escape2Html(aa.htmld);
                var zhtmld = iframeWin.escape2Html(aa.zhtmld);
                var explain = iframeWin.escape2Html(aa.explain);
                var zexplain = iframeWin.escape2Html(aa.zexplain);

                iframeWin.getmtype(aa.mtype);//媒体类型
                iframeWin.getyuyinDu(aa.dmusicpath);//与越南读题
                iframeWin.getzyuyinDu(aa.zdmusicpath);//语音读题藏
                iframeWin.getmusicPath(aa.musicpath);//语音技巧讲解
                iframeWin.getzmusicPath(aa.zmusicpath);//语音技巧讲解藏
                iframeWin.getjiqiaoMtype(aa.tmtype);//技巧媒体类型

                //利用方法将富文本框内容传给子页面
                iframeWin.htitle(htmltitle);
                iframeWin.zhtitle(zhtmltitle);
                iframeWin.ha(htmla);
                iframeWin.zha(zhtmla);
                iframeWin.hb(htmlb);
                iframeWin.zhb(zhtmlb);
                iframeWin.hc(htmlc);
                iframeWin.zhc(zhtmlc);
                iframeWin.hd(htmld);
                iframeWin.zhd(zhtmld);
                iframeWin.ex(explain);
                iframeWin.zex(zexplain);
                body.find(":radio[name='type'][value='" + aa.type + "']").prop("checked", "checked");
            },
            end:function () {
                $subtable.bootstrapTable('refresh');
            }
        });
    }

    //查看题目(汉)
    function ShwoDetail1(key) {
        layer.open({
            type: 2,
            title: '查看题目信息',
            area: ['1000px', '90%'],
            fixed: false, //不固定
            maxmin: true,
            content: "/page/secondtype/secondtype_subject_view_1.jsp?key=" + key,
            /*success: function (layero, index) {
                var body = layer.getChildFrame('body', index);
            }*/
        });
    }

    //查看题目(藏)
    function ShwoDetail2(key) {
        layer.open({
            type: 2,
            title: '查看题目信息',
            area: ['1000px', '90%'],
            fixed: false, //不固定
            maxmin: true,
            content: "/page/secondtype/secondtype_subject_view_2.jsp?key=" + key,
            /* success: function (layero, index) {
                 var body = layer.getChildFrame('body', index);
             }*/
        });
    }


    //删除单个题目
    function DelSubject(key) {
        var ids = [];
        ids.push(key);
        layer.confirm('确定是否删除该题所有信息', {
            btn: ['确定', '取消'] //按钮
        }, function () {
            $.ajax({
                contentType: 'application/json;charset=UTF-8',
                type: 'DELETE',
                dataType: "json",
                data: JSON.stringify(ids),
                url: '/subjects',
                success: function (json) {
                    if (json.status == "success") {
                        layer.msg('操作成功', {icon: 1, time: 1000});
                        $('#subjecttable').bootstrapTable('refresh');
                    } else {
                        layer.msg('删除失败', {icon: 2, time: 1000});
                    }
                },
                error: function () {
                    layer.msg('网络连接失败', {icon: 5, time: 1000});
                }
            });
        }, function () {
            layer.msg('取消操作成功', {icon: 1, time: 1000});
        });
    }

    //多选删除
    function Deltimu() {
        var ids = $.map($("#subjecttable").bootstrapTable('getSelections'), function (row) {
            return row.id;
        });
        if (ids.length == 0) {
            layer.msg('请选择数据');
        } else {
            layer.confirm('确定是否删除选中题目', {
                btn: ['确定', '取消'] //按钮
            }, function () {
                $.ajax({
                    contentType: 'application/json;charset=UTF-8',
                    type: 'delete',
                    url: "/subjects",
                    data: JSON.stringify(ids),
                    dataType: 'json',
                    success: function (json) {
                        if (json.status === "success") {
                            layer.msg('操作成功', {icon: 1, time: 1000});
                            $('#subjecttable').bootstrapTable('refresh');
                        } else {
                            layer.msg('删除失败', {icon: 2, time: 1000});
                        }
                    },
                    error: function () {
                        layer.msg('服务器繁忙，请刷新页面后重试', {icon: 5, time: 1000});
                    }
                });
            }, function () {
                layer.msg('取消操作成功', {icon: 1, time: 1000});
            });
        }
    }

    //选择题目类型
    function typeq(key) {
        var $a = $("#ttt");
        if (key === 3) {
            $('#subjecttable').bootstrapTable('refresh', {url: '/subject'});
            $($a).find("a[onclick='typeq(3)']").attr("class", "text-success font-bold");
            $($a).find("a[onclick='typeq(0)']").attr("class", "text-muted");
            $($a).find("a[onclick='typeq(2)']").attr("class", "text-muted");
            $($a).find("a[onclick='typeq(1)']").attr("class", "text-muted");
        }
        if (key === 0) {
            $('#subjecttable').bootstrapTable('refresh', {url: '/subjectByType?type=0'});
            $($a).find("a[onclick='typeq(0)']").attr("class", "text-success font-bold");
            $($a).find("a[onclick='typeq(3)']").attr("class", "text-muted");
            $($a).find("a[onclick='typeq(2)']").attr("class", "text-muted");
            $($a).find("a[onclick='typeq(1)']").attr("class", "text-muted");
        }
        if (key === 1) {
            $('#subjecttable').bootstrapTable('refresh', {url: '/subjectByType?type=1'});
            $($a).find("a[onclick='typeq(1)']").attr("class", "text-success font-bold");
            $($a).find("a[onclick='typeq(3)']").attr("class", "text-muted");
            $($a).find("a[onclick='typeq(2)']").attr("class", "text-muted");
            $($a).find("a[onclick='typeq(0)']").attr("class", "text-muted");
        }
        if (key === 2) {
            $('#subjecttable').bootstrapTable('refresh', {url: '/subjectByType?type=2'});
            $($a).find("a[onclick='typeq(2)']").attr("class", "text-success font-bold");
            $($a).find("a[onclick='typeq(3)']").attr("class", "text-muted");
            $($a).find("a[onclick='typeq(1)']").attr("class", "text-muted");
            $($a).find("a[onclick='typeq(0)']").attr("class", "text-muted");
        }

    }

    $('#keywords').bind('onkeydown', function(event) {
        if (event.keyCode == "13") {
            //回车执行查询
            Searchsubject();
            console.info(111);
        }
    });

    //关键字或ID搜索题目
    function Searchsubject() {
        var value = $("input[name='keywords']").val();
        $('#subjecttable').bootstrapTable('refresh', {url: '/seekSubjects?keyCode=' + value});
    }



</script>

</body>
</html>